<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="../css/002main.css">
    <title>Document</title>
    <script type="text/javascript">
        window.onload = function(){
            var aData = [
                ['进口柠檬','../images/003goods001.jpg'],['玫瑰香葡萄','../images/003goods002.jpg'],
                ['大兴大棚草莓','../images/003goods003.jpg'],['吐鲁番梨光杏','../images/003goods004.jpg'],
                ['黄肉桃','../images/003goods005.jpg'],['进口西梅','../images/003goods006.jpg'],
                ['香梨','../images/003goods007.jpg'],['栗子','../images/003goods008.jpg'],
                ['海南香蕉','../images/003goods009.jpg'],['青苹果','../images/003goods010.jpg'],
                ['山莓','../images/003goods011.jpg'],['奇异果','../images/003goods012.jpg'],
                ['蜜桔','../images/003goods013.jpg'],['脐橙','../images/003goods014.jpg'],
                ['椰子','../images/003goods015.jpg']];
            
            // 请将数据按照列表的结构放入到页面中
            // 获取html对象
            var oUl = document.getElementById("list");
            // 存储字符串
            var sTr = "";
            // 控制行
            var iRowLength = aData.length;
            for (var i = 0; i < iRowLength; i++) {
                // 控制列
                var aColumnData = aData[i];
                sTr += "<li><a href='#'><img src='"+aColumnData[1]+"' alt=''></a><h4>"+aColumnData[0]+"</h4></li>"
            }
            // 修改html的代码
            oUl.innerHTML = sTr;
        }


    </script>
</head>
<body>
    <ul class="con clearfix" id="list">
        
        <!--商品列表模板
        <li>
            <a href="#"><img src="images/goods001.jpg" alt=""></a>
            <h4>商品名字</h4>
        </li>
        -->

             
    </ul>
</body>
</html>